<template>
	<view style="background-color: #fff; height: 100vh;">
		<view class="tanchuang" v-if="tanchuang">
			请勾选协议
		</view>
		<view class="search2-top">
				信息授权
		</view>
		<image @click="backFn" class="search2-top-left-img" src="../../../static/images/search1/back.png" mode=""></image>
		<view class="empower">
			<image class="empower-img" src="../../../static/images/realestate/empower.png" mode="widthFix"></image>
			<view class="empower-argree">
				<checkbox-group  @change="getChecked">
				<checkbox style="transform:scale(0.6);" :checked="checked"/><text>我已阅读并同意<text class="bule">《用户服务协议》</text>及<text class="bule">《用户隐私政策》</text></text>
				</checkbox-group>
				<view class="agree-to-authorize" @click="agreeauthorizeFn">
					同意授权
				</view>
				<view class="deny-authorization">
					拒绝授权
				</view>
			</view>
		</view>
	</view>
</template>

<script setup>
	import { ref, reactive, shallowRef } from 'vue'
	const tanchuang=ref(false)
	const checked=ref(false)
	const backFn = () => {
		uni.navigateBack(-1)
	}
	const getChecked=()=>{
		checked.value = !checked.value
	}
	const agreeauthorizeFn=()=>{
		
		if(checked.value==true){
			uni.navigateTo({
				url:'/pages/realestate/realestate'
			})
		}else{
			tanchuang.value=true
			setTimeout(()=>{
				tanchuang.value=false
			},1000)
		}
	}
</script>

<style lang="scss" scoped>

	.tanchuang{
		position: fixed;
		z-index: 33;
		padding: 40rpx 100rpx;
		background-color: rgba(40, 44, 53, 0.6);
		color: #fff;
		top: 50%;
		left: 50%;
		transform: translate(-50%,-50%);
		border-radius: 20rpx;
	}
	.search2-top{
		height: 184rpx;
		background: #FFFFFF;
		border-radius: 0rpx 0rpx 0rpx 0rpx;
		opacity: 1;
		padding-top: 96rpx;

		font-size: 34rpx;
		font-family: PingFang SC, PingFang SC;
		font-weight: 400;
		color: #333333;
		position: relative;
		line-height: 88rpx;
		text-align: center;
			
		
	}
	.search2-top-left-img{
				width: 88rpx;
				height: 88rpx;
				position: absolute;
				// float: left;
				top: 100rpx;
				
			
		}
	
		.empower{
			position: relative;
			.empower-img{
				width: 100%;
			}
			.empower-argree{
				position: absolute;
				bottom: 117rpx;
				width: 90%;
				margin-left: 5%;
				
				
				font-size: 24rpx;
				font-family: PingFang SC, PingFang SC;
				font-weight: 400;
				color: #AAAAAA;
				.bule{
					color: #007AFF;
				}
				.agree-to-authorize{
				margin-top: 30rpx;
					height: 84rpx;
					background: #4B73E7;
					border-radius: 42rpx 42rpx 42rpx 42rpx;
					opacity: 1;
					text-align: center;
				line-height: 84rpx;
					font-size: 28rpx;
					font-family: PingFang SC, PingFang SC;
					font-weight: 400;
					color: #FFFFFF;
	
				}
			
			}
			.deny-authorization{
				margin-top: 30rpx;
				text-align: center;
				height: 40rpx;
				font-size: 28rpx;
				font-family: PingFang SC, PingFang SC;
				font-weight: 400;
				color: #333333;
			}
		}
		
</style>
